<template>
  <div class="icons">
      <!-- <Header title="双击复制"/> -->

         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-add"></i>
            <p>ios-add</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-add"></i>
            <p>md-add</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-add-circle"></i>
            <p>ios-add-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-add-circle-outline"></i>
            <p>ios-add-circle-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-add-circle"></i>
            <p>md-add-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-alarm"></i>
            <p>ios-alarm</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-alarm-outline"></i>
            <p>ios-alarm-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-alarm"></i>
            <p>md-alarm</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-albums"></i>
            <p>ios-albums</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-albums-outline"></i>
            <p>ios-albums-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-albums"></i>
            <p>md-albums</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-alert"></i>
            <p>ios-alert</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-alert-outline"></i>
            <p>ios-alert-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-alert"></i>
            <p>md-alert</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-american-football"></i>
            <p>ios-american-football</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-american-football-outline" ></i>
            <p>ios-american-football-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-american-football"></i>
            <p>md-american-football</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-analytics"></i>
            <p>ios-analytics</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-analytics-outline"></i>
            <p>ios-analytics-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-analytics"></i>
            <p>md-analytics</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-android"></i>
            <p>logo-android</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-angular"></i>
            <p>logo-angular</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-aperture"></i>
            <p>ios-aperture</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-aperture-outline"></i>
            <p>ios-aperture-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-aperture"></i>
            <p>md-aperture</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-apple"></i>
            <p>logo-apple</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-apps"></i>
            <p>ios-apps</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-apps-outline"></i>
            <p>ios-apps-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-apps"></i>
            <p>md-apps</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-appstore"></i>
            <p>ios-appstore</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-appstore-outline"></i>
            <p>ios-appstore-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-appstore"></i>
            <p>md-appstore</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-archive"></i>
            <p>ios-archive</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-archive-outline"></i>
            <p>ios-archive-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-archive"></i>
            <p>md-archive</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-back"></i>
            <p>ios-arrow-back</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-back"></i>
            <p>md-arrow-back</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-down"></i>
            <p>ios-arrow-down</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-down"></i>
            <p>md-arrow-down</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-dropdown"></i>
            <p>ios-arrow-dropdown</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-dropdown"></i>
            <p>md-arrow-dropdown</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-dropdown-circle"></i>
            <p>ios-arrow-dropdown-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-dropdown-circle"></i>
            <p>md-arrow-dropdown-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-dropleft"></i>
            <p>ios-arrow-dropleft</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-dropleft"></i>
            <p>md-arrow-dropleft</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-dropleft-circle"></i>
            <p>ios-arrow-dropleft-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-dropleft-circle"></i>
            <p>md-arrow-dropleft-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-dropright"></i>
            <p>ios-arrow-dropright</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-dropright"></i>
            <p>md-arrow-dropright</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-arrow-dropright-circle" ></i>
            <p>ios-arrow-dropright-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-dropright-circle"></i>
            <p>md-arrow-dropright-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-dropup"></i>
            <p>ios-arrow-dropup</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-dropup"></i>
            <p>md-arrow-dropup</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-dropup-circle"></i>
            <p>ios-arrow-dropup-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-dropup-circle"></i>
            <p>md-arrow-dropup-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-forward"></i>
            <p>ios-arrow-forward</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-forward"></i>
            <p>md-arrow-forward</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-round-back"></i>
            <p>ios-arrow-round-back</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-round-back"></i>
            <p>md-arrow-round-back</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-round-down"></i>
            <p>ios-arrow-round-down</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-round-down"></i>
            <p>md-arrow-round-down</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-round-forward"></i>
            <p>ios-arrow-round-forward</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-round-forward"></i>
            <p>md-arrow-round-forward</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-round-up"></i>
            <p>ios-arrow-round-up</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-round-up"></i>
            <p>md-arrow-round-up</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-arrow-up"></i>
            <p>ios-arrow-up</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-arrow-up"></i>
            <p>md-arrow-up</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-at"></i>
            <p>ios-at</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-at-outline"></i>
            <p>ios-at-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-at"></i>
            <p>md-at</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-attach"></i>
            <p>ios-attach</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-attach"></i>
            <p>md-attach</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-backspace"></i>
            <p>ios-backspace</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-backspace-outline"></i>
            <p>ios-backspace-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-backspace"></i>
            <p>md-backspace</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-barcode"></i>
            <p>ios-barcode</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-barcode-outline"></i>
            <p>ios-barcode-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-barcode"></i>
            <p>md-barcode</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-baseball"></i>
            <p>ios-baseball</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-baseball-outline"></i>
            <p>ios-baseball-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-baseball"></i>
            <p>md-baseball</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-basket"></i>
            <p>ios-basket</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-basket-outline"></i>
            <p>ios-basket-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-basket"></i>
            <p>md-basket</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-basketball"></i>
            <p>ios-basketball</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-basketball-outline"></i>
            <p>ios-basketball-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-basketball"></i>
            <p>md-basketball</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-battery-charging"></i>
            <p>ios-battery-charging</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-battery-charging"></i>
            <p>md-battery-charging</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-battery-dead"></i>
            <p>ios-battery-dead</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-battery-dead"></i>
            <p>md-battery-dead</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-battery-full"></i>
            <p>ios-battery-full</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-battery-full"></i>
            <p>md-battery-full</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-beaker"></i>
            <p>ios-beaker</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-beaker-outline"></i>
            <p>ios-beaker-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-beaker"></i>
            <p>md-beaker</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-beer"></i>
            <p>ios-beer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-beer-outline"></i>
            <p>ios-beer-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-beer"></i>
            <p>md-beer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bicycle"></i>
            <p>ios-bicycle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-bicycle"></i>
            <p>md-bicycle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-bitcoin"></i>
            <p>logo-bitcoin</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bluetooth"></i>
            <p>ios-bluetooth</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-bluetooth"></i>
            <p>md-bluetooth</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-boat"></i>
            <p>ios-boat</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-boat-outline"></i>
            <p>ios-boat-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-boat"></i>
            <p>md-boat</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-body"></i>
            <p>ios-body</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-body-outline"></i>
            <p>ios-body-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-body"></i>
            <p>md-body</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bonfire"></i>
            <p>ios-bonfire</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bonfire-outline"></i>
            <p>ios-bonfire-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-bonfire"></i>
            <p>md-bonfire</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-book"></i>
            <p>ios-book</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-book-outline"></i>
            <p>ios-book-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-book"></i>
            <p>md-book</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bookmark"></i>
            <p>ios-bookmark</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bookmark-outline"></i>
            <p>ios-bookmark-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-bookmark"></i>
            <p>md-bookmark</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bookmarks"></i>
            <p>ios-bookmarks</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bookmarks-outline"></i>
            <p>ios-bookmarks-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-bookmarks"></i>
            <p>md-bookmarks</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bowtie"></i>
            <p>ios-bowtie</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bowtie-outline"></i>
            <p>ios-bowtie-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-bowtie"></i>
            <p>md-bowtie</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-briefcase"></i>
            <p>ios-briefcase</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-briefcase-outline"></i>
            <p>ios-briefcase-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-briefcase"></i>
            <p>md-briefcase</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-browsers"></i>
            <p>ios-browsers</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-browsers-outline"></i>
            <p>ios-browsers-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-browsers"></i>
            <p>md-browsers</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-brush"></i>
            <p>ios-brush</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-brush-outline"></i>
            <p>ios-brush-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-brush"></i>
            <p>md-brush</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-buffer"></i>
            <p>logo-buffer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bug"></i>
            <p>ios-bug</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bug-outline"></i>
            <p>ios-bug-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-bug"></i>
            <p>md-bug</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-build"></i>
            <p>ios-build</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-build-outline"></i>
            <p>ios-build-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-build"></i>
            <p>md-build</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bulb"></i>
            <p>ios-bulb</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bulb-outline"></i>
            <p>ios-bulb-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-bulb"></i>
            <p>md-bulb</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bus"></i>
            <p>ios-bus</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-bus-outline"></i>
            <p>ios-bus-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-bus"></i>
            <p>md-bus</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cafe"></i>
            <p>ios-cafe</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cafe-outline"></i>
            <p>ios-cafe-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cafe"></i>
            <p>md-cafe</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-calculator"></i>
            <p>ios-calculator</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-calculator-outline"></i>
            <p>ios-calculator-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-calculator"></i>
            <p>md-calculator</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-calendar"></i>
            <p>ios-calendar</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-calendar-outline"></i>
            <p>ios-calendar-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-calendar"></i>
            <p>md-calendar</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-call"></i>
            <p>ios-call</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-call-outline"></i>
            <p>ios-call-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-call"></i>
            <p>md-call</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-camera"></i>
            <p>ios-camera</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-camera-outline"></i>
            <p>ios-camera-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-camera"></i>
            <p>md-camera</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-car"></i>
            <p>ios-car</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-car-outline"></i>
            <p>ios-car-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-car"></i>
            <p>md-car</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-card"></i>
            <p>ios-card</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-card-outline"></i>
            <p>ios-card-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-card"></i>
            <p>md-card</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cart"></i>
            <p>ios-cart</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cart-outline"></i>
            <p>ios-cart-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cart"></i>
            <p>md-cart</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cash"></i>
            <p>ios-cash</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cash-outline"></i>
            <p>ios-cash-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cash"></i>
            <p>md-cash</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-chatboxes"></i>
            <p>ios-chatboxes</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-chatboxes-outline"></i>
            <p>ios-chatboxes-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-chatboxes"></i>
            <p>md-chatboxes</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-chatbubbles"></i>
            <p>ios-chatbubbles</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-chatbubbles-outline"></i>
            <p>ios-chatbubbles-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-chatbubbles"></i>
            <p>md-chatbubbles</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-checkbox"></i>
            <p>ios-checkbox</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-checkbox-outline"></i>
            <p>ios-checkbox-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-checkbox"></i>
            <p>md-checkbox</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-checkbox-outline"></i>
            <p>md-checkbox-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-checkmark"></i>
            <p>ios-checkmark</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-checkmark"></i>
            <p>md-checkmark</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-checkmark-circle"></i>
            <p>ios-checkmark-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-checkmark-circle-outline" ></i>
            <p>ios-checkmark-circle-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-checkmark-circle"></i>
            <p>md-checkmark-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-md-checkmark-circle-outline" ></i>
            <p>md-checkmark-circle-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-chrome"></i>
            <p>logo-chrome</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-clipboard"></i>
            <p>ios-clipboard</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-clipboard-outline"></i>
            <p>ios-clipboard-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-clipboard"></i>
            <p>md-clipboard</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-clock"></i>
            <p>ios-clock</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-clock-outline"></i>
            <p>ios-clock-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-clock"></i>
            <p>md-clock</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-close"></i>
            <p>ios-close</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-close"></i>
            <p>md-close</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-close-circle"></i>
            <p>ios-close-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-close-circle-outline"></i>
            <p>ios-close-circle-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-close-circle"></i>
            <p>md-close-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-closed-captioning"></i>
            <p>ios-closed-captioning</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-closed-captioning-outline" ></i>
            <p>ios-closed-captioning-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-closed-captioning"></i>
            <p>md-closed-captioning</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloud"></i>
            <p>ios-cloud</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloud-outline"></i>
            <p>ios-cloud-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cloud"></i>
            <p>md-cloud</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloud-circle"></i>
            <p>ios-cloud-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloud-circle-outline"></i>
            <p>ios-cloud-circle-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cloud-circle"></i>
            <p>md-cloud-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloud-done"></i>
            <p>ios-cloud-done</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloud-done-outline"></i>
            <p>ios-cloud-done-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cloud-done"></i>
            <p>md-cloud-done</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloud-download"></i>
            <p>ios-cloud-download</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-cloud-download-outline" ></i>
            <p>ios-cloud-download-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cloud-download"></i>
            <p>md-cloud-download</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cloud-outline"></i>
            <p>md-cloud-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloud-upload"></i>
            <p>ios-cloud-upload</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloud-upload-outline"></i>
            <p>ios-cloud-upload-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cloud-upload"></i>
            <p>md-cloud-upload</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloudy"></i>
            <p>ios-cloudy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloudy-outline"></i>
            <p>ios-cloudy-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cloudy"></i>
            <p>md-cloudy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloudy-night"></i>
            <p>ios-cloudy-night</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cloudy-night-outline"></i>
            <p>ios-cloudy-night-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cloudy-night"></i>
            <p>md-cloudy-night</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-code"></i>
            <p>ios-code</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-code"></i>
            <p>md-code</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-code-download"></i>
            <p>ios-code-download</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-code-download"></i>
            <p>md-code-download</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-code-working"></i>
            <p>ios-code-working</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-code-working"></i>
            <p>md-code-working</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-codepen"></i>
            <p>logo-codepen</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cog"></i>
            <p>ios-cog</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cog-outline"></i>
            <p>ios-cog-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cog"></i>
            <p>md-cog</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-color-fill"></i>
            <p>ios-color-fill</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-color-fill-outline"></i>
            <p>ios-color-fill-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-color-fill"></i>
            <p>md-color-fill</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-color-filter"></i>
            <p>ios-color-filter</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-color-filter-outline"></i>
            <p>ios-color-filter-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-color-filter"></i>
            <p>md-color-filter</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-color-palette"></i>
            <p>ios-color-palette</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-color-palette-outline"></i>
            <p>ios-color-palette-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-color-palette"></i>
            <p>md-color-palette</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-color-wand"></i>
            <p>ios-color-wand</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-color-wand-outline"></i>
            <p>ios-color-wand-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-color-wand"></i>
            <p>md-color-wand</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-compass"></i>
            <p>ios-compass</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-compass-outline"></i>
            <p>ios-compass-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-compass"></i>
            <p>md-compass</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-construct"></i>
            <p>ios-construct</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-construct-outline"></i>
            <p>ios-construct-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-construct"></i>
            <p>md-construct</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-contact"></i>
            <p>ios-contact</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-contact-outline"></i>
            <p>ios-contact-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-contact"></i>
            <p>md-contact</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-contacts"></i>
            <p>ios-contacts</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-contacts-outline"></i>
            <p>ios-contacts-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-contacts"></i>
            <p>md-contacts</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-contract"></i>
            <p>ios-contract</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-contract"></i>
            <p>md-contract</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-contrast"></i>
            <p>ios-contrast</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-contrast"></i>
            <p>md-contrast</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-copy"></i>
            <p>ios-copy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-copy-outline"></i>
            <p>ios-copy-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-copy"></i>
            <p>md-copy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-create"></i>
            <p>ios-create</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-create-outline"></i>
            <p>ios-create-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-create"></i>
            <p>md-create</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-crop"></i>
            <p>ios-crop</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-crop-outline"></i>
            <p>ios-crop-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-crop"></i>
            <p>md-crop</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-css3"></i>
            <p>logo-css3</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cube"></i>
            <p>ios-cube</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cube-outline"></i>
            <p>ios-cube-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cube"></i>
            <p>md-cube</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cut"></i>
            <p>ios-cut</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-cut-outline"></i>
            <p>ios-cut-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-cut"></i>
            <p>md-cut</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-designernews"></i>
            <p>logo-designernews</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-desktop"></i>
            <p>ios-desktop</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-desktop-outline"></i>
            <p>ios-desktop-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-desktop"></i>
            <p>md-desktop</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-disc"></i>
            <p>ios-disc</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-disc-outline"></i>
            <p>ios-disc-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-disc"></i>
            <p>md-disc</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-document"></i>
            <p>ios-document</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-document-outline"></i>
            <p>ios-document-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-document"></i>
            <p>md-document</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-done-all"></i>
            <p>ios-done-all</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-done-all"></i>
            <p>md-done-all</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-download"></i>
            <p>ios-download</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-download-outline"></i>
            <p>ios-download-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-download"></i>
            <p>md-download</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-dribbble"></i>
            <p>logo-dribbble</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-dropbox"></i>
            <p>logo-dropbox</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-easel"></i>
            <p>ios-easel</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-easel-outline"></i>
            <p>ios-easel-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-easel"></i>
            <p>md-easel</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-egg"></i>
            <p>ios-egg</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-egg-outline"></i>
            <p>ios-egg-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-egg"></i>
            <p>md-egg</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-euro"></i>
            <p>logo-euro</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-exit"></i>
            <p>ios-exit</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-exit-outline"></i>
            <p>ios-exit-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-exit"></i>
            <p>md-exit</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-expand"></i>
            <p>ios-expand</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-expand"></i>
            <p>md-expand</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-eye"></i>
            <p>ios-eye</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-eye-outline"></i>
            <p>ios-eye-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-eye"></i>
            <p>md-eye</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-eye-off"></i>
            <p>ios-eye-off</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-eye-off-outline"></i>
            <p>ios-eye-off-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-eye-off"></i>
            <p>md-eye-off</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-facebook"></i>
            <p>logo-facebook</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-fastforward"></i>
            <p>ios-fastforward</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-fastforward-outline"></i>
            <p>ios-fastforward-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-fastforward"></i>
            <p>md-fastforward</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-female"></i>
            <p>ios-female</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-female"></i>
            <p>md-female</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-filing"></i>
            <p>ios-filing</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-filing-outline"></i>
            <p>ios-filing-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-filing"></i>
            <p>md-filing</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-film"></i>
            <p>ios-film</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-film-outline"></i>
            <p>ios-film-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-film"></i>
            <p>md-film</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-finger-print"></i>
            <p>ios-finger-print</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-finger-print"></i>
            <p>md-finger-print</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-flag"></i>
            <p>ios-flag</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-flag-outline"></i>
            <p>ios-flag-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-flag"></i>
            <p>md-flag</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-flame"></i>
            <p>ios-flame</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-flame-outline"></i>
            <p>ios-flame-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-flame"></i>
            <p>md-flame</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-flash"></i>
            <p>ios-flash</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-flash-outline"></i>
            <p>ios-flash-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-flash"></i>
            <p>md-flash</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-flask"></i>
            <p>ios-flask</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-flask-outline"></i>
            <p>ios-flask-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-flask"></i>
            <p>md-flask</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-flower"></i>
            <p>ios-flower</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-flower-outline"></i>
            <p>ios-flower-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-flower"></i>
            <p>md-flower</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-folder"></i>
            <p>ios-folder</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-folder-outline"></i>
            <p>ios-folder-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-folder"></i>
            <p>md-folder</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-folder-open"></i>
            <p>ios-folder-open</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-folder-open-outline"></i>
            <p>ios-folder-open-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-folder-open"></i>
            <p>md-folder-open</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-football"></i>
            <p>ios-football</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-football-outline"></i>
            <p>ios-football-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-football"></i>
            <p>md-football</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-foursquare"></i>
            <p>logo-foursquare</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-freebsd-devil"></i>
            <p>logo-freebsd-devil</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-funnel"></i>
            <p>ios-funnel</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-funnel-outline"></i>
            <p>ios-funnel-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-funnel"></i>
            <p>md-funnel</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-game-controller-a"></i>
            <p>ios-game-controller-a</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-game-controller-a-outline" ></i>
            <p>ios-game-controller-a-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-game-controller-a"></i>
            <p>md-game-controller-a</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-game-controller-b"></i>
            <p>ios-game-controller-b</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-game-controller-b-outline" ></i>
            <p>ios-game-controller-b-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-game-controller-b"></i>
            <p>md-game-controller-b</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-git-branch"></i>
            <p>ios-git-branch</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-git-branch"></i>
            <p>md-git-branch</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-git-commit"></i>
            <p>ios-git-commit</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-git-commit"></i>
            <p>md-git-commit</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-git-compare"></i>
            <p>ios-git-compare</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-git-compare"></i>
            <p>md-git-compare</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-git-merge"></i>
            <p>ios-git-merge</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-git-merge"></i>
            <p>md-git-merge</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-git-network"></i>
            <p>ios-git-network</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-git-network"></i>
            <p>md-git-network</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-git-pull-request"></i>
            <p>ios-git-pull-request</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-git-pull-request"></i>
            <p>md-git-pull-request</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-github"></i>
            <p>logo-github</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-glasses"></i>
            <p>ios-glasses</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-glasses-outline"></i>
            <p>ios-glasses-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-glasses"></i>
            <p>md-glasses</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-globe"></i>
            <p>ios-globe</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-globe-outline"></i>
            <p>ios-globe-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-globe"></i>
            <p>md-globe</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-google"></i>
            <p>logo-google</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-googleplus"></i>
            <p>logo-googleplus</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-grid"></i>
            <p>ios-grid</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-grid-outline"></i>
            <p>ios-grid-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-grid"></i>
            <p>md-grid</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-hackernews"></i>
            <p>logo-hackernews</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-hammer"></i>
            <p>ios-hammer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-hammer-outline"></i>
            <p>ios-hammer-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-hammer"></i>
            <p>md-hammer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-hand"></i>
            <p>ios-hand</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-hand-outline"></i>
            <p>ios-hand-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-hand"></i>
            <p>md-hand</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-happy"></i>
            <p>ios-happy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-happy-outline"></i>
            <p>ios-happy-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-happy"></i>
            <p>md-happy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-headset"></i>
            <p>ios-headset</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-headset-outline"></i>
            <p>ios-headset-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-headset"></i>
            <p>md-headset</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-heart"></i>
            <p>ios-heart</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-heart-outline"></i>
            <p>ios-heart-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-heart"></i>
            <p>md-heart</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-heart-outline"></i>
            <p>md-heart-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-help"></i>
            <p>ios-help</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-help"></i>
            <p>md-help</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-help-buoy"></i>
            <p>ios-help-buoy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-help-buoy-outline"></i>
            <p>ios-help-buoy-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-help-buoy"></i>
            <p>md-help-buoy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-help-circle"></i>
            <p>ios-help-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-help-circle-outline"></i>
            <p>ios-help-circle-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-help-circle"></i>
            <p>md-help-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-home"></i>
            <p>ios-home</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-home-outline"></i>
            <p>ios-home-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-home"></i>
            <p>md-home</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-html5"></i>
            <p>logo-html5</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-ice-cream"></i>
            <p>ios-ice-cream</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-ice-cream-outline"></i>
            <p>ios-ice-cream-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-ice-cream"></i>
            <p>md-ice-cream</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-image"></i>
            <p>ios-image</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-image-outline"></i>
            <p>ios-image-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-image"></i>
            <p>md-image</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-images"></i>
            <p>ios-images</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-images-outline"></i>
            <p>ios-images-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-images"></i>
            <p>md-images</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-infinite"></i>
            <p>ios-infinite</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-infinite-outline"></i>
            <p>ios-infinite-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-infinite"></i>
            <p>md-infinite</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-information"></i>
            <p>ios-information</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-information"></i>
            <p>md-information</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-information-circle"></i>
            <p>ios-information-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-information-circle-outline" ></i>
            <p>ios-information-circle-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-information-circle"></i>
            <p>md-information-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-instagram"></i>
            <p>logo-instagram</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-ionic"></i>
            <p>ios-ionic</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-ionic-outline"></i>
            <p>ios-ionic-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-ionic"></i>
            <p>md-ionic</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-ionitron"></i>
            <p>ios-ionitron</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-ionitron-outline"></i>
            <p>ios-ionitron-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-ionitron"></i>
            <p>md-ionitron</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-javascript"></i>
            <p>logo-javascript</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-jet"></i>
            <p>ios-jet</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-jet-outline"></i>
            <p>ios-jet-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-jet"></i>
            <p>md-jet</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-key"></i>
            <p>ios-key</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-key-outline"></i>
            <p>ios-key-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-key"></i>
            <p>md-key</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-keypad"></i>
            <p>ios-keypad</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-keypad-outline"></i>
            <p>ios-keypad-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-keypad"></i>
            <p>md-keypad</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-laptop"></i>
            <p>ios-laptop</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-laptop"></i>
            <p>md-laptop</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-leaf"></i>
            <p>ios-leaf</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-leaf-outline"></i>
            <p>ios-leaf-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-leaf"></i>
            <p>md-leaf</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-link"></i>
            <p>ios-link</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-link-outline"></i>
            <p>ios-link-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-link"></i>
            <p>md-link</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-linkedin"></i>
            <p>logo-linkedin</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-list"></i>
            <p>ios-list</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-list"></i>
            <p>md-list</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-list-box"></i>
            <p>ios-list-box</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-list-box-outline"></i>
            <p>ios-list-box-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-list-box"></i>
            <p>md-list-box</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-locate"></i>
            <p>ios-locate</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-locate-outline"></i>
            <p>ios-locate-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-locate"></i>
            <p>md-locate</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-lock"></i>
            <p>ios-lock</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-lock-outline"></i>
            <p>ios-lock-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-lock"></i>
            <p>md-lock</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-log-in"></i>
            <p>ios-log-in</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-log-in"></i>
            <p>md-log-in</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-log-out"></i>
            <p>ios-log-out</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-log-out"></i>
            <p>md-log-out</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-magnet"></i>
            <p>ios-magnet</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-magnet-outline"></i>
            <p>ios-magnet-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-magnet"></i>
            <p>md-magnet</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-mail"></i>
            <p>ios-mail</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-mail-outline"></i>
            <p>ios-mail-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-mail"></i>
            <p>md-mail</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-mail-open"></i>
            <p>ios-mail-open</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-mail-open-outline"></i>
            <p>ios-mail-open-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-mail-open"></i>
            <p>md-mail-open</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-male"></i>
            <p>ios-male</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-male"></i>
            <p>md-male</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-man"></i>
            <p>ios-man</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-man-outline"></i>
            <p>ios-man-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-man"></i>
            <p>md-man</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-map"></i>
            <p>ios-map</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-map-outline"></i>
            <p>ios-map-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-map"></i>
            <p>md-map</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-markdown"></i>
            <p>logo-markdown</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-medal"></i>
            <p>ios-medal</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-medal-outline"></i>
            <p>ios-medal-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-medal"></i>
            <p>md-medal</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-medical"></i>
            <p>ios-medical</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-medical-outline"></i>
            <p>ios-medical-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-medical"></i>
            <p>md-medical</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-medkit"></i>
            <p>ios-medkit</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-medkit-outline"></i>
            <p>ios-medkit-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-medkit"></i>
            <p>md-medkit</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-megaphone"></i>
            <p>ios-megaphone</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-megaphone-outline"></i>
            <p>ios-megaphone-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-megaphone"></i>
            <p>md-megaphone</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-menu"></i>
            <p>ios-menu</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-menu-outline"></i>
            <p>ios-menu-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-menu"></i>
            <p>md-menu</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-mic"></i>
            <p>ios-mic</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-mic-outline"></i>
            <p>ios-mic-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-mic"></i>
            <p>md-mic</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-mic-off"></i>
            <p>ios-mic-off</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-mic-off-outline"></i>
            <p>ios-mic-off-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-mic-off"></i>
            <p>md-mic-off</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-microphone"></i>
            <p>ios-microphone</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-microphone-outline"></i>
            <p>ios-microphone-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-microphone"></i>
            <p>md-microphone</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-moon"></i>
            <p>ios-moon</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-moon-outline"></i>
            <p>ios-moon-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-moon"></i>
            <p>md-moon</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-more"></i>
            <p>ios-more</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-more-outline"></i>
            <p>ios-more-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-more"></i>
            <p>md-more</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-move"></i>
            <p>ios-move</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-move"></i>
            <p>md-move</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-musical-note"></i>
            <p>ios-musical-note</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-musical-note-outline"></i>
            <p>ios-musical-note-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-musical-note"></i>
            <p>md-musical-note</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-musical-notes"></i>
            <p>ios-musical-notes</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-musical-notes-outline"></i>
            <p>ios-musical-notes-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-musical-notes"></i>
            <p>md-musical-notes</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-navigate"></i>
            <p>ios-navigate</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-navigate-outline"></i>
            <p>ios-navigate-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-navigate"></i>
            <p>md-navigate</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-no-smoking"></i>
            <p>ios-no-smoking</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-no-smoking-outline"></i>
            <p>ios-no-smoking-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-no-smoking"></i>
            <p>md-no-smoking</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-nodejs"></i>
            <p>logo-nodejs</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-notifications"></i>
            <p>ios-notifications</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-notifications-outline"></i>
            <p>ios-notifications-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-notifications"></i>
            <p>md-notifications</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-notifications-off"></i>
            <p>ios-notifications-off</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-notifications-off-outline" ></i>
            <p>ios-notifications-off-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-notifications-off"></i>
            <p>md-notifications-off</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-notifications-outline"></i>
            <p>md-notifications-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-nuclear"></i>
            <p>ios-nuclear</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-nuclear-outline"></i>
            <p>ios-nuclear-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-nuclear"></i>
            <p>md-nuclear</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-nutrition"></i>
            <p>ios-nutrition</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-nutrition-outline"></i>
            <p>ios-nutrition-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-nutrition"></i>
            <p>md-nutrition</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-octocat"></i>
            <p>logo-octocat</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-open"></i>
            <p>ios-open</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-open-outline"></i>
            <p>ios-open-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-open"></i>
            <p>md-open</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-options"></i>
            <p>ios-options</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-options-outline"></i>
            <p>ios-options-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-options"></i>
            <p>md-options</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-outlet"></i>
            <p>ios-outlet</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-outlet-outline"></i>
            <p>ios-outlet-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-outlet"></i>
            <p>md-outlet</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-paper"></i>
            <p>ios-paper</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-paper-outline"></i>
            <p>ios-paper-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-paper"></i>
            <p>md-paper</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-paper-plane"></i>
            <p>ios-paper-plane</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-paper-plane-outline"></i>
            <p>ios-paper-plane-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-paper-plane"></i>
            <p>md-paper-plane</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-partly-sunny"></i>
            <p>ios-partly-sunny</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-partly-sunny-outline"></i>
            <p>ios-partly-sunny-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-partly-sunny"></i>
            <p>md-partly-sunny</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pause"></i>
            <p>ios-pause</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pause-outline"></i>
            <p>ios-pause-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-pause"></i>
            <p>md-pause</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-paw"></i>
            <p>ios-paw</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-paw-outline"></i>
            <p>ios-paw-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-paw"></i>
            <p>md-paw</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-people"></i>
            <p>ios-people</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-people-outline"></i>
            <p>ios-people-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-people"></i>
            <p>md-people</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-person"></i>
            <p>ios-person</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-person-outline"></i>
            <p>ios-person-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-person"></i>
            <p>md-person</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-person-add"></i>
            <p>ios-person-add</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-person-add-outline"></i>
            <p>ios-person-add-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-person-add"></i>
            <p>md-person-add</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-phone-landscape"></i>
            <p>ios-phone-landscape</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-phone-landscape"></i>
            <p>md-phone-landscape</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-phone-portrait"></i>
            <p>ios-phone-portrait</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-phone-portrait"></i>
            <p>md-phone-portrait</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-photos"></i>
            <p>ios-photos</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-photos-outline"></i>
            <p>ios-photos-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-photos"></i>
            <p>md-photos</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pie"></i>
            <p>ios-pie</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pie-outline"></i>
            <p>ios-pie-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-pie"></i>
            <p>md-pie</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pin"></i>
            <p>ios-pin</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pin-outline"></i>
            <p>ios-pin-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-pin"></i>
            <p>md-pin</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pint"></i>
            <p>ios-pint</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pint-outline"></i>
            <p>ios-pint-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-pint"></i>
            <p>md-pint</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-pinterest"></i>
            <p>logo-pinterest</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pizza"></i>
            <p>ios-pizza</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pizza-outline"></i>
            <p>ios-pizza-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-pizza"></i>
            <p>md-pizza</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-plane"></i>
            <p>ios-plane</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-plane-outline"></i>
            <p>ios-plane-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-plane"></i>
            <p>md-plane</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-planet"></i>
            <p>ios-planet</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-planet-outline"></i>
            <p>ios-planet-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-planet"></i>
            <p>md-planet</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-play"></i>
            <p>ios-play</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-play-outline"></i>
            <p>ios-play-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-play"></i>
            <p>md-play</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-playstation"></i>
            <p>logo-playstation</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-podium"></i>
            <p>ios-podium</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-podium-outline"></i>
            <p>ios-podium-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-podium"></i>
            <p>md-podium</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-power"></i>
            <p>ios-power</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-power-outline"></i>
            <p>ios-power-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-power"></i>
            <p>md-power</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pricetag"></i>
            <p>ios-pricetag</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pricetag-outline"></i>
            <p>ios-pricetag-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-pricetag"></i>
            <p>md-pricetag</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pricetags"></i>
            <p>ios-pricetags</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pricetags-outline"></i>
            <p>ios-pricetags-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-pricetags"></i>
            <p>md-pricetags</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-print"></i>
            <p>ios-print</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-print-outline"></i>
            <p>ios-print-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-print"></i>
            <p>md-print</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pulse"></i>
            <p>ios-pulse</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-pulse-outline"></i>
            <p>ios-pulse-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-pulse"></i>
            <p>md-pulse</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-python"></i>
            <p>logo-python</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-qr-scanner"></i>
            <p>ios-qr-scanner</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-qr-scanner"></i>
            <p>md-qr-scanner</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-quote"></i>
            <p>ios-quote</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-quote-outline"></i>
            <p>ios-quote-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-quote"></i>
            <p>md-quote</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-radio"></i>
            <p>ios-radio</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-radio-outline"></i>
            <p>ios-radio-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-radio"></i>
            <p>md-radio</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-radio-button-off"></i>
            <p>ios-radio-button-off</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-radio-button-off"></i>
            <p>md-radio-button-off</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-radio-button-on"></i>
            <p>ios-radio-button-on</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-radio-button-on"></i>
            <p>md-radio-button-on</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-rainy"></i>
            <p>ios-rainy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-rainy-outline"></i>
            <p>ios-rainy-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-rainy"></i>
            <p>md-rainy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-recording"></i>
            <p>ios-recording</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-recording-outline"></i>
            <p>ios-recording-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-recording"></i>
            <p>md-recording</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-reddit"></i>
            <p>logo-reddit</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-redo"></i>
            <p>ios-redo</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-redo-outline"></i>
            <p>ios-redo-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-redo"></i>
            <p>md-redo</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-refresh"></i>
            <p>ios-refresh</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-refresh"></i>
            <p>md-refresh</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-refresh-circle"></i>
            <p>ios-refresh-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-refresh-circle-outline" ></i>
            <p>ios-refresh-circle-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-refresh-circle"></i>
            <p>md-refresh-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-remove"></i>
            <p>ios-remove</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-remove"></i>
            <p>md-remove</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-remove-circle"></i>
            <p>ios-remove-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-remove-circle-outline"></i>
            <p>ios-remove-circle-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-remove-circle"></i>
            <p>md-remove-circle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-reorder"></i>
            <p>ios-reorder</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-reorder"></i>
            <p>md-reorder</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-repeat"></i>
            <p>ios-repeat</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-repeat"></i>
            <p>md-repeat</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-resize"></i>
            <p>ios-resize</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-resize"></i>
            <p>md-resize</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-restaurant"></i>
            <p>ios-restaurant</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-restaurant-outline"></i>
            <p>ios-restaurant-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-restaurant"></i>
            <p>md-restaurant</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-return-left"></i>
            <p>ios-return-left</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-return-left"></i>
            <p>md-return-left</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-return-right"></i>
            <p>ios-return-right</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-return-right"></i>
            <p>md-return-right</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-reverse-camera"></i>
            <p>ios-reverse-camera</p>
        </div>
         <div class="icons-item" @click="copy"><i
                class="x-icon x-icon-ios-reverse-camera-outline" ></i>
            <p>ios-reverse-camera-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-reverse-camera"></i>
            <p>md-reverse-camera</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-rewind"></i>
            <p>ios-rewind</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-rewind-outline"></i>
            <p>ios-rewind-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-rewind"></i>
            <p>md-rewind</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-ribbon"></i>
            <p>ios-ribbon</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-ribbon-outline"></i>
            <p>ios-ribbon-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-ribbon"></i>
            <p>md-ribbon</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-rose"></i>
            <p>ios-rose</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-rose-outline"></i>
            <p>ios-rose-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-rose"></i>
            <p>md-rose</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-rss"></i>
            <p>logo-rss</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-sad"></i>
            <p>ios-sad</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-sad-outline"></i>
            <p>ios-sad-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-sad"></i>
            <p>md-sad</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-sass"></i>
            <p>logo-sass</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-school"></i>
            <p>ios-school</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-school-outline"></i>
            <p>ios-school-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-school"></i>
            <p>md-school</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-search"></i>
            <p>ios-search</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-search-outline"></i>
            <p>ios-search-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-search"></i>
            <p>md-search</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-send"></i>
            <p>ios-send</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-send-outline"></i>
            <p>ios-send-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-send"></i>
            <p>md-send</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-settings"></i>
            <p>ios-settings</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-settings-outline"></i>
            <p>ios-settings-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-settings"></i>
            <p>md-settings</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-share"></i>
            <p>ios-share</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-share-outline"></i>
            <p>ios-share-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-share"></i>
            <p>md-share</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-share-alt"></i>
            <p>ios-share-alt</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-share-alt-outline"></i>
            <p>ios-share-alt-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-share-alt"></i>
            <p>md-share-alt</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-shirt"></i>
            <p>ios-shirt</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-shirt-outline"></i>
            <p>ios-shirt-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-shirt"></i>
            <p>md-shirt</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-shuffle"></i>
            <p>ios-shuffle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-shuffle"></i>
            <p>md-shuffle</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-skip-backward"></i>
            <p>ios-skip-backward</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-skip-backward-outline"></i>
            <p>ios-skip-backward-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-skip-backward"></i>
            <p>md-skip-backward</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-skip-forward"></i>
            <p>ios-skip-forward</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-skip-forward-outline"></i>
            <p>ios-skip-forward-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-skip-forward"></i>
            <p>md-skip-forward</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-skype"></i>
            <p>logo-skype</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-snapchat"></i>
            <p>logo-snapchat</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-snow"></i>
            <p>ios-snow</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-snow-outline"></i>
            <p>ios-snow-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-snow"></i>
            <p>md-snow</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-speedometer"></i>
            <p>ios-speedometer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-speedometer-outline"></i>
            <p>ios-speedometer-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-speedometer"></i>
            <p>md-speedometer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-square"></i>
            <p>ios-square</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-square-outline"></i>
            <p>ios-square-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-square"></i>
            <p>md-square</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-square-outline"></i>
            <p>md-square-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-star"></i>
            <p>ios-star</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-star-outline"></i>
            <p>ios-star-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-star"></i>
            <p>md-star</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-star-half"></i>
            <p>ios-star-half</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-star-half"></i>
            <p>md-star-half</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-star-outline"></i>
            <p>md-star-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-stats"></i>
            <p>ios-stats</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-stats-outline"></i>
            <p>ios-stats-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-stats"></i>
            <p>md-stats</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-steam"></i>
            <p>logo-steam</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-stopwatch"></i>
            <p>ios-stopwatch</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-stopwatch-outline"></i>
            <p>ios-stopwatch-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-stopwatch"></i>
            <p>md-stopwatch</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-subway"></i>
            <p>ios-subway</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-subway-outline"></i>
            <p>ios-subway-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-subway"></i>
            <p>md-subway</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-sunny"></i>
            <p>ios-sunny</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-sunny-outline"></i>
            <p>ios-sunny-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-sunny"></i>
            <p>md-sunny</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-swap"></i>
            <p>ios-swap</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-swap"></i>
            <p>md-swap</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-switch"></i>
            <p>ios-switch</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-switch-outline"></i>
            <p>ios-switch-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-switch"></i>
            <p>md-switch</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-sync"></i>
            <p>ios-sync</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-sync"></i>
            <p>md-sync</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-tablet-landscape"></i>
            <p>ios-tablet-landscape</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-tablet-landscape"></i>
            <p>md-tablet-landscape</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-tablet-portrait"></i>
            <p>ios-tablet-portrait</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-tablet-portrait"></i>
            <p>md-tablet-portrait</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-tennisball"></i>
            <p>ios-tennisball</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-tennisball-outline"></i>
            <p>ios-tennisball-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-tennisball"></i>
            <p>md-tennisball</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-text"></i>
            <p>ios-text</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-text-outline"></i>
            <p>ios-text-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-text"></i>
            <p>md-text</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-thermometer"></i>
            <p>ios-thermometer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-thermometer-outline"></i>
            <p>ios-thermometer-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-thermometer"></i>
            <p>md-thermometer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-thumbs-down"></i>
            <p>ios-thumbs-down</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-thumbs-down-outline"></i>
            <p>ios-thumbs-down-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-thumbs-down"></i>
            <p>md-thumbs-down</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-thumbs-up"></i>
            <p>ios-thumbs-up</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-thumbs-up-outline"></i>
            <p>ios-thumbs-up-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-thumbs-up"></i>
            <p>md-thumbs-up</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-thunderstorm"></i>
            <p>ios-thunderstorm</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-thunderstorm-outline"></i>
            <p>ios-thunderstorm-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-thunderstorm"></i>
            <p>md-thunderstorm</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-time"></i>
            <p>ios-time</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-time-outline"></i>
            <p>ios-time-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-time"></i>
            <p>md-time</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-timer"></i>
            <p>ios-timer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-timer-outline"></i>
            <p>ios-timer-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-timer"></i>
            <p>md-timer</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-train"></i>
            <p>ios-train</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-train-outline"></i>
            <p>ios-train-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-train"></i>
            <p>md-train</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-transgender"></i>
            <p>ios-transgender</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-transgender"></i>
            <p>md-transgender</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-trash"></i>
            <p>ios-trash</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-trash-outline"></i>
            <p>ios-trash-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-trash"></i>
            <p>md-trash</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-trending-down"></i>
            <p>ios-trending-down</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-trending-down"></i>
            <p>md-trending-down</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-trending-up"></i>
            <p>ios-trending-up</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-trending-up"></i>
            <p>md-trending-up</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-trophy"></i>
            <p>ios-trophy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-trophy-outline"></i>
            <p>ios-trophy-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-trophy"></i>
            <p>md-trophy</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-tumblr"></i>
            <p>logo-tumblr</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-tux"></i>
            <p>logo-tux</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-twitch"></i>
            <p>logo-twitch</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-twitter"></i>
            <p>logo-twitter</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-umbrella"></i>
            <p>ios-umbrella</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-umbrella-outline"></i>
            <p>ios-umbrella-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-umbrella"></i>
            <p>md-umbrella</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-undo"></i>
            <p>ios-undo</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-undo-outline"></i>
            <p>ios-undo-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-undo"></i>
            <p>md-undo</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-unlock"></i>
            <p>ios-unlock</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-unlock-outline"></i>
            <p>ios-unlock-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-unlock"></i>
            <p>md-unlock</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-usd"></i>
            <p>logo-usd</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-videocam"></i>
            <p>ios-videocam</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-videocam-outline"></i>
            <p>ios-videocam-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-videocam"></i>
            <p>md-videocam</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-vimeo"></i>
            <p>logo-vimeo</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-volume-down"></i>
            <p>ios-volume-down</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-volume-down"></i>
            <p>md-volume-down</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-volume-mute"></i>
            <p>ios-volume-mute</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-volume-mute"></i>
            <p>md-volume-mute</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-volume-off"></i>
            <p>ios-volume-off</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-volume-off"></i>
            <p>md-volume-off</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-volume-up"></i>
            <p>ios-volume-up</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-volume-up"></i>
            <p>md-volume-up</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-walk"></i>
            <p>ios-walk</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-walk"></i>
            <p>md-walk</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-warning"></i>
            <p>ios-warning</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-warning-outline"></i>
            <p>ios-warning-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-warning"></i>
            <p>md-warning</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-watch"></i>
            <p>ios-watch</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-watch"></i>
            <p>md-watch</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-water"></i>
            <p>ios-water</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-water-outline"></i>
            <p>ios-water-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-water"></i>
            <p>md-water</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-whatsapp"></i>
            <p>logo-whatsapp</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-wifi"></i>
            <p>ios-wifi</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-wifi-outline"></i>
            <p>ios-wifi-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-wifi"></i>
            <p>md-wifi</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-windows"></i>
            <p>logo-windows</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-wine"></i>
            <p>ios-wine</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-wine-outline"></i>
            <p>ios-wine-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-wine"></i>
            <p>md-wine</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-woman"></i>
            <p>ios-woman</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-woman-outline"></i>
            <p>ios-woman-outline</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-md-woman"></i>
            <p>md-woman</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-wordpress"></i>
            <p>logo-wordpress</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-xbox"></i>
            <p>logo-xbox</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-yahoo"></i>
            <p>logo-yahoo</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-yen"></i>
            <p>logo-yen</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-logo-youtube"></i>
            <p>logo-youtube</p>
        </div>
         <div class="icons-item" @click="copy"><i class="x-icon x-icon-ios-loading"></i>
            <p>ios-loading</p>
        </div>

        <!-- <p ref="textarea" id="biao1"  > {{text}}</p> -->

        <input v-model="text" ref="textarea" placeholder="edit me">
    </div>
</template>
<script>
export default {
  name: 'x-icon',
  data () {
    return {
      msg: 'Welcome to Your x-icon ',
      text:'',
      num: 1
    }
  },
  methods:{
    copy (e) {
      if (!e.target.innerText) {
        this.text = `<x-icon type="${e.target.parentNode.innerText}" size="big"/>`
      } else {
        this.text = `<x-icon type="${e.target.innerText}" size="big"/>`
      }
      this.$refs.textarea.select(); // 选择对象
      document.execCommand("Copy"); // 执行浏览器复制命令
      if (++this.num > 2) {
        this.num = 1
        this.$Message.info(`已复制好，可贴粘。`)
      }
      setTimeout(()=>{
        this.num = 1
      },500)
    }
  }
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss">
.icons{
    input {
        opacity: 0;
        height: 0;
        position: absolute;
        top: -10000;
        left: 0;
    }
    .icons-item{
        float: left;
        // margin: .1rem 0 0;
        width: 25%;
        text-align: center;
        list-style: none;
        cursor: pointer;
        height: vw(60vw);
        color: #5c6b77;
        transition: all .2s ease;
        position: relative;
        padding-top: 10px;
        font-size: vw(20vw);

    }
    p{
        font-size: vw(10vw);
        margin-top: vw(5vw);
        color: #5c6b77;
        height: vw(42vw);
        &:hover{
            
            color: #09f
        }
    }
}
</style>